

<template>
  <canvas id="wordCanvas" style="background-color: transparent; border: 1px solid black"
  ></canvas>
  <el-button @click="()=>{
      addWordCom.apply(()=>{

      });

  }" circle class="ani-btn-appear" style="width: 50px;height: 50px; position: absolute;right: 20px; bottom: 80px;" :icon="Plus" type="success" v-if="showControllerBtn"></el-button>
  <el-button @click="()=>{
    showControllerBtn=!showControllerBtn
  }" circle style="width: 50px;height: 50px;z-index: 999; position: absolute;right: 20px; bottom: 20px;" :icon="Setting" type="primary"></el-button>
  <controller ref="controllerCom"></controller>
  <add-word ref="addWordCom"></add-word>
  <bottom-page ref="bottomPageCom" :show="showControllerBtn"></bottom-page>
  <top-page v-if="showControllerBtn"></top-page>
  <word-level ref="wordLevelCom"></word-level>
  <audio id="audioPlayer"  src="http://dict.youdao.com/dictvoice?audio=good"></audio>

</template>
<script setup>
import{onMounted,ref} from 'vue';
import word_logic from "@/pages/wordPage/src/word_logic";
import {getMySetting, getMyWord} from "@/apis/apis";
import config from "@/config"
import {Plus, Setting} from "@element-plus/icons-vue";
import Controller from "@/pages/wordPage/controller/controller.vue";
import AddWord from "@/pages/wordPage/addWord/addWord.vue";
import BottomPage from "@/pages/wordPage/bottomPage/bottomPage.vue";
import WordLevel from "@/pages/wordPage/wordLevelEdit/wordLevel.vue";
import setting from "@/setting";
import TopPage from "@/pages/wordPage/topPage/topPage.vue";
let controllerCom=ref(null);
let showControllerBtn=ref(false);
let addWordCom=ref(null);
let wordLevelCom=ref(null);
let bottomPageCom=ref(null);

onMounted(async ()=>{
  await loadSetting();

  await word_logic.init();
    word_logic.wordOnClick((e)=>{
      console.log("x",e)
      word_logic.chooseOrCancelWord(e.content)
    })
  word_logic.wordOnDoubleClick((e)=>{
    wordLevelCom.value.apply(()=>{},e);
  })
  // word_logic.loadAndPushMyWord();

})
let myWord=ref([{
  "content": "精",
  "username": "test",
  "description": "fugiat quis irure",
  "level": 1,
  "updateDatetime": "2025-04-13T15:41:58.000+00:00"
}])
async function loadSetting(){
   let d=await getMySetting({})
    setting.value=d.data.data;
    console.log("载入设置：",d.data.data);


}


</script>
<style scoped>

</style>